<template>
	<div id="mailList" v-loading="loading">
		<div class="i_maxW">
			<div class="u_crumbs">
				<router-link to="/personal/index">个人中心</router-link>
				<strong>
					<router-link to="/personal/resource/index" class="fade-router"><i>></i>我的资源</router-link>
				</strong>
				<strong><i>></i>资源编辑</strong>
			</div>
			<!--  -->
			<div class="u_resource">
				<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="resource-ruleForm">
					<el-form-item label="资源名称" prop="name">
						<el-input v-model.trim="ruleForm.name" maxlength="50" placeholder="最多可输入50个字" v-cloak></el-input>
					</el-form-item>
					<el-form-item label="分类" prop="cate_id" v-if='$store.state.isCheckLevel'>
						<el-select filterable v-model="ruleForm.cate_id"  placeholder="请选择" class='cate_id'>
							<el-option v-for="item in classificationList" :key="item.id" :label="item.name" :value="item.id">
							</el-option>
						</el-select>

					</el-form-item>

					<el-form-item label-width="0">
						<el-col :span="8">
							<el-form-item label="学段" prop="study_section_id">
								<el-select filterable v-model="ruleForm.study_section_id" placeholder="请选择活" v-cloak @change="relateChange($event,'study_section')">
									<el-option v-for="(item, index) in orgLevel2" :label="item.name" :value="item.id" :key="index"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item label="年级" prop="grade_id">
								<el-select filterable v-model="ruleForm.grade_id" placeholder="请选择活" v-cloak @change="relateChange($event,'grade')">
									<el-option v-for="(item, index) in orgLevel3" :label="item.name" :value="item.id" :key="index"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item label="科目" prop="subject_id">
								<el-select filterable v-model="ruleForm.subject_id" placeholder="请选择活" v-cloak @change="relateChange($event,'subject')">
									<el-option v-for="(item, index) in orgSubject" :label="item.name" :value="item.id" :key="index"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
					</el-form-item>
					<el-form-item label-width="0">
						<el-col :span="8">
							<el-form-item label="版本" prop="version_id">
								<el-select filterable v-model="ruleForm.version_id" placeholder="请选择活" v-cloak @change="relateChange($event,'version')">
									<el-option v-for="(item, index) in orgVersion" :label="item.name" :value="item.id" :key="index"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item label="教材" prop="material_id">
								<el-select filterable v-model="ruleForm.material_id" placeholder="请选择活" v-cloak @change="relateChange($event,'material')">
									<el-option v-for="(item, index) in orgMaterial" :label="item.name" :value="item.id" :key="index"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item label="章" prop="list_1_id">
								<el-select filterable v-model="ruleForm.list_1_id" placeholder="请选择活" v-cloak @change="relateChange($event,'list_1')">
									<el-option v-for="(item, index) in orgList1" :label="item.name" :value="item.id" :key="index"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
					</el-form-item>
					<el-form-item label="节" prop="list_2_id" class="list_2_id">
						<el-col :span="8">
							<el-select filterable v-model="ruleForm.list_2_id" placeholder="请选择活" v-cloak>
								<el-option v-for="(item, index) in orgList2" :label="item.name" :value="item.id" :key="index"></el-option>
							</el-select>
						</el-col>
					</el-form-item>
					<el-form-item label="简介" prop="profile">
						<el-input type="textarea" v-model.trim="ruleForm.profile" :rows="6" placeholder="不超200字" v-cloak maxlength="200" show-word-limit>
						</el-input>
					</el-form-item>
					<el-form-item label="权限" prop="authority">
						<el-radio-group v-model="ruleForm.authority" v-cloak>
							<el-radio :label="1">公开</el-radio>
							<el-radio :label="0">不公开</el-radio>
						</el-radio-group>
					</el-form-item>
					<el-form-item label="允许下载" prop="is_download">
						<el-radio-group v-model="ruleForm.is_download" v-cloak>
							<el-radio :label="1">是</el-radio>
							<el-radio :label="0">否</el-radio>
						</el-radio-group>
					</el-form-item>
					<el-form-item class="r_submitBox buttonCSS">
						<el-button @click="resetForm('ruleForm')" type="primary" plain>取消</el-button>
						<el-button type="primary" @click.prevent="submitForm('ruleForm')" v-preventReClick>保存</el-button>
					</el-form-item>
				</el-form>
			</div>
		</div>
	</div>
</template>
<script>
export default {
	data() {
		return {
			orgLevel2: this.$g.orgLevel2,
			orgLevel3: [],
			orgSubject: [],
			orgVersion: [],
			orgMaterial: [],
			orgList1: [],
			orgList2: [],
			id: this.$route.query.id,
			ruleForm: {
				id: this.$route.query.id,
				name: undefined, //资源名称
				study_section_id: undefined, //学段
				grade_id: undefined, //年级
				subject_id: undefined, //科目
				version_id: undefined, //版本
				material_id: undefined, //教材
				list_1_id: undefined, // 章id
				list_2_id: undefined, // 节id
				authority: undefined, //权限
				is_download: undefined, //允许下载
				profile: '', //简介
				format_pdf: undefined,
				cate_id: undefined
			},
			rules: {
				name: [
					{ required: true, message: '资源名称不能为空', trigger: 'change' }
				],
				study_section_id: [
					{ required: true, message: '请选择学段', trigger: 'change' }
				],
				grade_id: [
					{ required: true, message: '请选择年级', trigger: 'change' }
				],
				subject_id: [
					{ required: true, message: '请选择年级', trigger: 'change' }
				],
				cate_id: [{ required: true, message: '请选择分类', trigger: 'change' }]
			},
			loading: false,
			classificationList: [],
		};
	},
	created() {
		this.resourceMsg();
		this.$store.state.isCheckLevel &&  this.getClassification()
	},
	computed: {

	},
	methods: {
		getClassification(){

			let success =(res)=>{
				this.classificationList = res.data
				this.classificationList.unshift({name: '全部', id: 0})
			}

			let params = {}
			this.$ajax.get('api/resource/resource_cate', { params, func: { success: success} })
		},
		//数据请求
		resourceMsg() {
			let success = (res => {
				let data = res.data[0];
				this.orgLevel2 = this.$g.orgLevel2; 
				this.ruleForm.name = data.name,
				this.ruleForm.study_section_id = parseInt(data.study_section_id) === 0 ? undefined : data.study_section_id, //学段
				this.ruleForm.grade_id = parseInt(data.grade_id) === 0 ? undefined : data.grade_id, //年级
				this.ruleForm.subject_id = parseInt(data.subject_id) === 0 ? undefined : data.subject_id, //科目
				this.ruleForm.version_id = parseInt(data.version_id) === 0 ? undefined : data.version_id, //版本
				this.ruleForm.material_id = parseInt(data.material_id) === 0 ? undefined : data.material_id, //教材
				this.ruleForm.list_1_id = parseInt(data.list_1_id) === 0 ? undefined : data.list_1_id, // 章id
				this.ruleForm.list_2_id = parseInt(data.list_2_id) === 0 ? undefined : data.list_2_id, // 节id
				this.ruleForm.authority = data.authority, //权限
				this.ruleForm.is_download = data.is_download, //允许下载
				this.ruleForm.profile = data.profile, //简介
				this.ruleForm.cate_id = data.cate_id

				// this.getOrgLevel2()
				this.getOrgLevel3();
				this.getSubject();
				this.getVersion();
				this.getMaterial();
				this.getList1();
				this.getList2();
			
			});
			this.$ajax({
				url: '/api/resource/resource',
				method: 'get',
				params: { id: this.id },
				func: { success: success }
			})
		},
		/**
		 * 联动下拉框的方法
		 * @DateTime 2020-03-05T10:44:43+0800
		 * @param    {[type]}                 newVal [选中的id]
		 * @param    {[type]}                 type   [类型]
		 * @return   {[type]}                        [description]
		 */
		relateChange(newVal, type) {
			// console.info(obj,dd)
			switch (type) {
				case 'study_section':
					this.ruleForm.grade_id = undefined;
					this.ruleForm.subject_id = undefined;
					this.ruleForm.version_id = undefined;
					this.ruleForm.material_id = undefined;
					this.ruleForm.list_1_id = undefined;
					this.ruleForm.list_2_id = undefined;

					this.orgLevel3 = [];
					this.orgSubject = [];
					this.orgVersion = [];
					this.orgMaterial = [];
					this.orgList1 = [];
					this.orgList2 = [];

					this.ruleForm.study_section_id = newVal;
					this.getOrgLevel3();
					break;
				case 'grade':
					this.ruleForm.subject_id = undefined;
					this.ruleForm.version_id = undefined;
					this.ruleForm.material_id = undefined;
					this.ruleForm.list_1_id = undefined;
					this.ruleForm.list_2_id = undefined;

					this.orgSubject = [];
					this.orgVersion = [];
					this.orgMaterial = [];
					this.orgList1 = [];
					this.orgList2 = [];


					this.ruleForm.grade_id = newVal;
					this.getSubject();

					break;
				case 'subject':
					this.ruleForm.version_id = undefined;
					this.ruleForm.material_id = undefined;
					this.ruleForm.list_1_id = undefined;
					this.ruleForm.list_2_id = undefined;

					this.orgVersion = [];
					this.orgMaterial = [];
					this.orgList1 = [];
					this.orgList2 = [];

					this.ruleForm.subject_id = newVal
					this.getVersion();

					break;
				case 'version':
					this.ruleForm.material_id = undefined;
					this.ruleForm.list_1_id = undefined;
					this.ruleForm.list_2_id = undefined;

					this.orgMaterial = [];
					this.orgList1 = [];
					this.orgList2 = [];

					this.ruleForm.version_id = newVal;
					this.getMaterial();
					break;
				case 'material':
					this.ruleForm.list_1_id = undefined;
					this.ruleForm.list_2_id = undefined;

					this.orgList1 = [];
					this.orgList2 = [];

					this.ruleForm.material_id = newVal;
					this.getList1();

					break;
				case 'list_1':
					this.ruleForm.list_2_id = undefined;

					this.orgList2 = [];

					this.ruleForm.list_1_id = newVal;
					this.getList2();
					break;
				default:
					break;

			}
		},
		//获取学段
		getOrgLevel2() {
			let success = (res => {
				let data = res.data;
				this.orgLevel2 = data
			});

			let params = {
				level: 2,
				pid: 1,
				direction: 'balance',
			}

			if (this.$store.state.isCheckLevel) {
				this.$ajax.get('api/newlevel/platform_org', { params: params, func: { success: success } })
			} else {
				this.$ajax.get('api/org/org', { params: params, func: { success: success } })
			}

		},
		//获取年级
		getOrgLevel3() {
			let success = (res => {
				let data = res.data;
				this.orgLevel3 = data;

			});

			let params = {
				level: 3,
				pid: this.ruleForm.study_section_id,
				direction: 'balance',
			}

			if (this.$store.state.isCheckLevel) {
				this.$ajax.get('api/newlevel/platform_org', { params: params, func: { success: success } })
			} else {
				this.$ajax.get('api/org/org', { params: params, func: { success: success } })
			}
		},
		//获取科目
		getSubject(flag) {
			let success = (res => {
				let data = res.data;
				this.orgSubject = data;

			});


			let params = {
				type: 2,
				org_id: this.ruleForm.grade_id,
				status: 1,
			}

			if (this.$store.state.isCheckLevel) {
				this.$ajax.get('api/newlevel/platform_subject', { params: params, func: { success: success } })
			} else {
				this.$ajax.get('api/cate/subject', { params: params, func: { success: success } })
			}
		},
		//获取版本
		getVersion() {
			let success = (res => {
				let data = res.data;
				this.orgVersion = data;
			})
			this.$ajax({
				url: 'api/cate/version',
				method: 'get',
				params: {
					org_id: this.ruleForm.grade_id,
					sub_id: this.ruleForm.subject_id,
					type: 2,
					status: 1
				},
				func: { success: success }
			})
		},
		//获取教材
		getMaterial() {
			let success = (res => {
				let data = res.data;
				this.orgMaterial = data;
			})

			let params = {
				org_id: this.ruleForm.grade_id,
				sub_id: this.ruleForm.subject_id,
				ver_id: this.ruleForm.version_id,
				status: 1
			}

			if (this.$store.state.isCheckLevel) {
				this.$ajax.get('api/newlevel/platform_material', { params: params, func: { success: success } })
			} else {
				this.$ajax.get('api/cate/material', { params: params, func: { success: success } })
			}

		},
		//获取章
		getList1() {
			let success = (res => {
				let data = res.data;
				this.orgList1 = data;

			});
			this.$ajax({
				url: 'api/cate/cate_list',
				method: 'get',
				params: {
					pid: 0,
					level: 1,
					material_id: this.ruleForm.material_id,
				},
				func: { success: success }
			})
		},
		//获取节
		getList2() {
			let success = (res => {
				let data = res.data;
				this.orgList2 = data;
			});
			this.$ajax({
				url: 'api/cate/cate_list',
				method: 'get',
				params: {
					pid: this.ruleForm.list_1_id,
					level: 2,
					material_id: this.ruleForm.material_id
				},
				func: { success: success }
			})
		},
		/**
		 * 数据提交
		 * @DateTime 2020-03-05T11:08:28+0800
		 * @param    {[type]}                 formName [description]
		 * @return   {[type]}                          [description]
		 */
		submitForm(formName) {

			this.$refs[formName].validate((valid) => {
				if (valid) {
					this.loading = true


					let params = this.ruleForm
					let success = (res => {
						let data = res.data;

						if (this.roleBaseid(4) && this.ruleForm.authority == 1) {
							this.$message.success('修改成功，请等待管理员审核')
						} else {
							this.$message.success(res.msg);
						}


						setTimeout(() => {
							this.loading = false
							this.$router.push({ path: '/personal/resource/index' })
						}, 800);

					});

					/*根据角色判断上传的资源是否要审核 1.正常 2.审核中*/
					this.ruleForm.status = this.roleBaseid(4, 5) ? 2 : 1
				

					this.$ajax({
						url: 'api/resource/resource',
						method: 'put',
						data: params,
						func: { success: success }
					})

				} else {
					console.log('error submit!!');
					return false;
				}
			});
		},
		resetForm(formName) {
			this.$router.back(-1)
		},

	}
}
</script>